<template>
  <div class="home">
    <input v-model="msgForm.userId" />
    <input v-model="msgForm.message" />
    <button @click="websocketSend">发消息</button>

    <button @click="sendUser">发消息个人</button>
    <button @click="sendAll">发消息广播</button>
    <div v-html="html"></div>
  </div>
</template>

<script>
import { sendSock, createWebSocket, closeSock } from '@/api/WebSocketApi'
import { getAction, postAction } from '@/api/manage'
export default {
  data() {
    return {
      websock: null,
      msgForm:{},
      html: '',
    }
  },
  created() {
    createWebSocket(this.websocketOnMessage)
  },
  methods: {
    // 数据接收
    websocketOnMessage(e) {
      this.html += '<div>' + e.message + '</div>'
      // this.websocketClose()
    },
    // 数据发送
    websocketSend() {
      sendSock(this.msgForm)
    },
    // 关闭
    websocketClose(e) {
      closeSock('断开连接', e)
    },
    sendUser(){
      postAction("/socket/sendUser",this.msgForm).then(res=>{

      })
    },
    sendAll(){
      postAction("/socket/sendAll",this.msgForm).then(res=>{

      })
    }
  },
}
</script>
